<!-- 后台管理页面侧边栏 -->
<template>
  <div class="common-layout">
    <el-container>
    <el-header class="header" style="width:100%;height:50px;background-color: black;">
      <div class="title">诗词后台管理系统</div> 
    </el-header>
    <el-container style="height: calc(100vh - 50px);background:rgba(156,150,150,0.5) ">
      <el-aside class="aside" >
        <el-menu
        :router="true"
  
        class="el-menu"
        text-color="#black"
        active-text-color="#2466ff">
        <el-sub-menu index="/admin">
          <template #title>
            <span class="fontstyle">用户管理</span>
          </template >
            <el-menu-item class="xiao" index="/admin/users">用户列表</el-menu-item>
        </el-sub-menu>
        <el-sub-menu index="3">
          <template #title>
            <span class="fontstyle">用户反馈管理</span>
          </template>
          <el-menu-item  class="xiao" index="/admin/wuliu">反馈管理</el-menu-item>
        </el-sub-menu>
        <el-sub-menu index="2">
          <template #title>
            <span class="fontstyle">搜索记录管理</span>
          </template>
          <el-menu-item class="xiao" index="/admin/upload" >记录管理</el-menu-item>
  
        </el-sub-menu>
        <el-sub-menu index="4">
          <template #title>
            <span class="fontstyle">用户收藏管理</span>
          </template>
          <el-menu-item class="xiao" index="/admin/star">收藏管理</el-menu-item>
        </el-sub-menu>
        <el-sub-menu index="5">
          <template #title>
            <span class="fontstyle">诗词管理</span>
          </template>
          <el-menu-item class="xiao" index="/admin/pote">诗词管理</el-menu-item>
        </el-sub-menu>
      </el-menu>
      </el-aside>
      <el-main class="main">

        <router-view>
        </router-view>
      </el-main>
    </el-container>
  </el-container>
  </div>
  </template>
  
  
  <style scoped>
  .fontstyle{
    font-weight: bold;
  }
  .xiao{
    background:rgba(131, 126, 126, 0.5);
  }
  .common-layout{
    background-image:url(../../public/dbk.jpeg);background-repeat: no-repeat;background-size: cover;
    margin:0 0;
    padding: 0 0;
    width: 100%;
    height: calc(100vh);
    background-color:#ccc
  }
  .main{
    font-style: italic;
    font-family: 	KaiTi;
    font-size:100px;
    color:rgb(71, 89, 150)
    
    
  }
  .el-menu{
    background:rgba(156,150,150,0.5)
  }
  .header{
    display: flex;
    
    line-height: 50px;
  }
  .aside{
    width: 180px;
    background: rgba(155, 148, 148, 0.5);
    
  }
  .title{
    color: aqua;
    display: flex;
    flex-direction: column;
    font-size: 20px;
    font-weight: bolder;
    font-style:italic;
    font-family: SimSun ;
  }
  .main{
    margin: 0 0;
    padding: 0 0;
  }
  
  </style>